<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="../../plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <link href="../../plugins/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css">
    <link href="../../plugins/zTree/css/metroStyle/metroStyle.css" rel="stylesheet" type="text/css">
    <link href="../../plugins/layui/css/layui.css" rel="stylesheet" media="all">

</head>
<body>
    <div class="container-fluid">
        <input type="hidden" id="userId" name="userid" th:value="${userId}">
        <input type="hidden" id="ids" name="ids" th:value="${ids}">

        <div class="zTreeDemoBackground">
            <ul id="tree" class="ztree"></ul>
        </div>

        <footer class="footer navbar-fixed-bottom" style="margin-left: 30%">
            <button class="layui-btn layui-btn-radius" onclick="save()">保存</button>
            <button class="layui-btn layui-btn-danger layui-btn-radius" onclick="shut()">关闭</button>
        </footer>
    </div>
</body>
    <script src="../../plugins/jquery/jquery.min.js"></script>
    <script src="../../plugins/zTree/js/jquery.ztree.core.min.js"></script>
    <script src="../../plugins/zTree/js/jquery.ztree.excheck.min.js"></script>
    <script src="../../plugins/zTree/js/jquery.ztree.exedit.min.js"></script>
    <script src="../../plugins/layui/layui.js"></script>
    <script src="../../modules/common/js/layuiTable.js"></script>

<SCRIPT type="text/javascript">
    var index = parent.layer.getFrameIndex(window.name);

    var setting = {
        check: {
            enable: true,
            //取消关联父节点
            //setting.check.chkboxType = { "Y" : "ps", "N" : "ps" };
            chkboxType: { "Y": "ps", "N": "ps" }
        },
        data: {
            simpleData: {
                enable: true,
                idKey : "roleId",
                pIdKey : "parentId",
                rootPId : "1",
            },
            /**
             * @description: 记住这次经验教训
             * @author 李贝留斯
             * @email sunyadongsyd@163.com
             * @date 2018/5/16 23:32
             */
            key:{
                name:"roleName"
            }
        },
        edit: {
            enable: true
        },
        async:{
            enable : true,
            url : "/sys/role/getRoleTreeData.html",
            autoParam : [ "roleId=parentId" ]
        },
        callback : {
            //onCheck : checked
        }
    };

    window.onload = function(){
        var treeObj = $.fn.zTree.init($("#tree"), setting);
        //var ids =  [[${ids}]];
        var ids = $("#ids").val();
        if (ids!=null){
            var idss = ids.split(",");
            setTimeout(function(){
                for(var i=0;i<idss.length;i++){
                    //alert(idss[i]);
                    var node = treeObj.getNodeByParam("roleId", idss[i]);
                    treeObj.selectNode(node);
                    treeObj.checkNode(node,true,true);
                }
                var nodes = treeObj.getNodes();
                for (var i = 0; i < nodes.length; i++) { //设置节点展开
                    treeObj.expandNode(nodes[i], true, false, true);
                }
            },500)
        }

        //var treeObj = $.fn.zTree.getZTreeObj("tree");
    };

    function checked(e,treeId,treeNode){
        treeNode.checkNode(node,true,true);
    }
    function save(){

        var index = parent.layer.getFrameIndex(window.name);
        var treeObj=$.fn.zTree.getZTreeObj("tree");
        nodes=treeObj.getCheckedNodes(true);
        var userId = $("#userId").val();
        var roleId = "";
        //v="";
        for(var i=0;i<nodes.length;i++){
            roleId += nodes[i].roleId + ","
        }
        $.ajax({
            type: "POST",
            url:"saveUserRole.html",
            data:{'roleId':roleId,'userId':userId},
            traditional:true,
            cache: false,
            success:function (data) {

                if (data.code == 0) {
                    parent.layer.close(index);
                    //parentlayer.msg('保存成功');
                    parent.layer.msg('保存成功', {shade: 0.2})
                    /* layer.msg("保存成功",{icon:1,time:2000}) */

                }if (data.code == 500) {
                    //parentlayer.msg('保存成功');
                    parent.layer.msg('保存失败', {shade: 0.2})
                    /* layer.msg("保存成功",{icon:1,time:2000}) */

                }
            }
        })
    }
    function shut(){
        //获取父页面
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
        reloadTable("userForm");
    }
</SCRIPT>
</html>